import Taro, { Component } from '@tarojs/taro'
import { View , Text , Image} from '@tarojs/components';
import { AtButton , AtRate  } from 'taro-ui';
import { getMyPending , getUserOrderStatus , waitCancleOrder} from '../../util/api';
import { intervalMin } from '../../util/util';
import './receipt.scss'
export default  class Receipt extends Component {
    constructor(){
        super(...arguments)
        this.state = {
            info:{}, //订单信息
            endCount:"", //支付之间
            timeTxt:{
                m:"00",
                s:"00",
            },
            funStatus:true,
        }
    }
    componentWillMount(){
       this.refrePageStatus();
    }
    refrePageStatus(){
        getMyPending({},true).then( res => {
            if(res.code == 0){
                this.setState({info:res.data,endCount:res.data.end_time},() => {
                    this.initCount();
                    this.state.funStatus ? this.evalCheckOrder() : "";
                });
            }else if(res.code == 2){//有人接单了
                Taro.showModal({
                    title:'提示',
                    content:"您的订单已被接单",
                }).then( res => {
                    Taro.redirectTo({url:"/pages/orderlist/orderlist"});
                    clearInterval(this.checkedOrder);
                    clearInterval(this.timp);
                })
            }
        })
    }
    initCount(){
        let { endCount , info } = this.state;
        clearInterval(this.timp);
        this.timp = setInterval(() => {
            let currentTime = (new Date()).valueOf() / 1000;
            let diffValue = intervalMin(currentTime , endCount);
            if(diffValue != 'end'){
                this.setState({timeTxt:diffValue})
            }else{
                clearInterval(this.timp);
                this.setState({timeTxt:{m:"00",s:"00"}}); //倒计时结束
                getUserOrderStatus().then( res => {   //下一步按钮的状态，1还是没有订单  0是等待接单   2是已结单正在进行
                    if(res.code == 0){ //没人接单
                        Taro.showModal({
                            title:"提示",
                            content:"暂时无人接单，请重新发单",
                        }).then( res => {
                            waitCancleOrder({id:info.id}).then( res => {
                                if(res.code == 0){
                                    Taro.showToast({title:res.msg,icon:"none"});
                                    setTimeout(() => {
                                        Taro.navigateBack();
                                    },700)
                                }else{
                                    Taro.showModal({title:"提示",content:res.msg})
                                }
                            })
                        })
                    }else if(res.code == 2){
                        Taro.showModal({
                            title:'提示',
                            content:"您的订单已被接单",
                        }).then( res => {
                            Taro.redirectTo({url:"/pages/orderlist/orderlist"})
                        })
                    } 
                })
            }
        },1000)
    }
    //轮训查订单
    evalCheckOrder(){
        let { endCount } = this.state;
        this.setState({funStatus:false})
        clearInterval(this.checkedOrder ? this.checkedOrder : "");
        this.checkedOrder = setInterval(() => {
            let currentTime = (new Date()).valueOf() / 1000;
            let diffValue = intervalMin(currentTime , endCount);
            if(diffValue == 'end'){
                clearInterval(this.checkedOrder);
            }else{
                this.refrePageStatus();
            }
        },10000)
    }
    cancleOrder(id){
        Taro.showModal({
            title:"提示",
            content:"确认取消订单吗",
        }).then( res => {
            if(res.confirm){
                waitCancleOrder({id}).then( res => {
                    if(res.code == 0){
                        Taro.showToast({title:"取消订单",icon:"none"});
                        setTimeout(() => {
                            Taro.navigateBack();
                        },700)
                    }else{
                        Taro.showModal({title:"提示",content:res.msg})
                    }
                })
            }
        })
    }
    render(){
        let { info , timeTxt } = this.state;
        return (
            <View className='receipt'>
                <View className='driver-card flex align-items space-between'>
                    <View className='left'>
                        <Image className='left-pic' src={info.headimg} />
                    </View>
                    <View className='flex1 right flex flex-wrap align-content-center'>
                        <View className='name'>{info.nickname}</View>
                        <AtRate value={5} size={15} />
                        <View className='carids'>{info.car_id}</View>
                    </View>
                    {/* <Image className='call-phone' src={`${baseImgSrc}/call_phone_bg.png`} /> */}
                </View>
                <View className='coutdown fn-ctr'>
                    <Text className='dt1'>{timeTxt.m}</Text>
                    <Text className='dt2'>:</Text>
                    <Text className='dt1'>{timeTxt.s}</Text>
                </View>
                <AtButton className='next-btn' type='secondary' size='normal' onClick={this.cancleOrder.bind(this,info.id)}>取消订单</AtButton>
            </View>
        )
    }
}